import {Col, Row} from "antd";

const thirdFace = () => {

    const layerStyle7 = {
        left: '30px',
        top: '111px',
        position: 'absolute',
        zIndex: 159,
        width: '290px',
        height: '32px'
    };

    const contentStyle7 = {
        overflowWrap: 'break-word',
        padding: '0px',
        borderColor: 'transparent',
        borderWidth: '0px',
        height: '32px',
        width: '290px',
        display: 'block'
    };

    const spanStyle7 = {
        fontFamily: '微软雅黑',
        fontSize: '14px',
        color: 'rgb(255, 255, 255)'
    };

    const layerStyle6 = {
        left: '30px',
        top: '72px',
        position: 'absolute',
        zIndex: 158,
        width: '301px',
        height: '35px'
    };

    const contentStyle6 = {
        overflowWrap: 'break-word',
        padding: '0px',
        borderColor: 'transparent',
        borderWidth: '0px',
        height: '35px',
        width: '301px',
        display: 'block'
    };

    const spanStyle6 = {
        fontFamily: '微软雅黑',
        fontSize: '20px',
        color: 'rgb(142, 49, 60)'
    };

    const containerStyle5 = {
        overflow: 'hidden',
        width: '385px',
        height: '210px',
        borderWidth: '0px',
        borderStyle: 'solid',
        padding: '0px'
    };

    const imageContainerStyle5 = {
        overflow: 'hidden',
        borderColor: 'transparent',
        borderWidth: '0px',
        position: 'relative',
        width: '385px',
        height: '210px'
    };

    const linkStyle5 = {
        lineHeight: 'normal'
    };

    const layerStyle2 = {
        left: '30px',
        top: '72px',
        position: 'absolute',
        zIndex: 154,
        width: '301px',
        height: '35px'
    };

    const contentStyle2 = {
        overflowWrap: 'break-word',
        padding: '0px',
        borderColor: 'transparent',
        borderWidth: '0px',
        height: '35px',
        width: '301px',
        display: 'block'
    };

    const spanStyle2 = {
        fontFamily: '微软雅黑',
        fontSize: '20px',
        color: 'rgb(5, 164, 198)'
    };
    const containerStyle = {
        overflow: 'hidden',
        width: '385px',
        height: '210px',
        borderWidth: '0px',
        borderStyle: 'solid',
        padding: '0px'
    };

    const imageContainerStyle = {
        overflow: 'hidden',
        borderColor: 'transparent',
        borderWidth: '0px',
        position: 'relative',
        width: '385px',
        height: '210px'
    };

    const linkStyle = {
        lineHeight: 'normal'
    };


    const containerStyle4 = {
        overflow: 'hidden',
        width: '385px',
        height: '210px',
        borderWidth: '0px',
        borderStyle: 'solid',
        padding: '0px'
    };

    const imageContainerStyle4 = {
        overflow: 'hidden',
        borderColor: 'transparent',
        borderWidth: '0px',
        position: 'relative',
        width: '385px',
        height: '210px'
    };

    const linkStyle4 = {
        lineHeight: 'normal'
    };
    return(
    <>
        <div>
            <br/> <br/> <br/>
        <Row >
            <Col span="8">
                <div className="wp-media_content" style={containerStyle4} type="0">
                    <div className="img_over" style={imageContainerStyle4}>
                        <a href="/season" className="media_link" style={linkStyle4}>
                            <img id="wp-media-image_layer4D4AC0650702983B34EF14F6E15BCC51"  className="paragraph_image" type="zoom" src="https://tpl-ca5b595-pic28.websiteonline.cn/upload/home_img_03.jpg" style={{ width: '385px', height: '210px' }} />
                        </a>
                    </div>
                </div>
                <div id="layer47836BF94702A702E083D03223DED79E" type="title" className="cstlayer" style={layerStyle6} mid="" fatherid="layer27C29CA08D58FCDA22CD55A81B1B78AC" deg="0">
                    <div className="wp-title_content" style={contentStyle6}>
                        <span style={spanStyle6}><strong>品味“汁”然百香果</strong></span>
                    </div>
                </div>
                <div id="layer92BFA7BD647A08BD74E68F1E02B67815" type="title" className="cstlayer" style={layerStyle7} mid="" fatherid="layer27C29CA08D58FCDA22CD55A81B1B78AC" deg="0">
                    <div className="wp-title_content" style={contentStyle7}>
                        <span style={spanStyle7}>水润酸甜 口味清爽 芳香浓郁 果香四溢</span>
                    </div>
                </div>
            </Col>
            <Col span="8">
        {/*第二图*/}
        <div className="wp-media_content" style={containerStyle} type="0">
            <div className="img_over" style={imageContainerStyle}>
                <a href="/season" className="media_link" style={linkStyle}>
                    <img id="wp-media-image_layer61F58F79B4CF650A9A0ADB308DAEE3EC" className="paragraph_image" type="zoom" src="https://tpl-ca5b595-pic28.websiteonline.cn/upload/home_img_05.jpg" style={{ width: '385px', height: '210px' }} />
                </a>
            </div>
        </div>
                <div id="layer2FDCED5CA666ED563EE7D5229F8F6202" type="title" className="cstlayer" style={layerStyle2} mid="" fatherid="layer6A0D76E4001436CA193D2EBA81CB0C14" deg="0">
                    <div className="wp-title_content" style={contentStyle2}>
                        <span style={spanStyle2}><strong>品质果肉 美味领先</strong></span>
                    </div>
                </div>
                <div id="layerB50A064796B8934BCD8B4958E3BDDE42" type="title" className="cstlayer" style={layerStyle7} mid="" fatherid="layer6A0D76E4001436CA193D2EBA81CB0C14" deg="0">
                    <div className="wp-title_content" style={contentStyle7}>
                        <span style={spanStyle7}>鲜然欲滴的小甜心 果然口口美味</span>
                    </div>
                </div>
            </Col>
            {/*第三图*/}
            <Col span="8">
            <div className="wp-media_content" style={containerStyle5} type="0">
                <div className="img_over" style={imageContainerStyle5}>
                    <a href="/season" className="media_link" style={linkStyle5}>
                        <img id="wp-media-image_layerA81D384C38F26A8388AA2E34998F0190"  className="paragraph_image" type="zoom" src="https://tpl-ca5b595-pic28.websiteonline.cn/upload/home_img_07.jpg" style={{ width: '385px', height: '210px' }} />
                    </a>
                </div>
            </div>
            <div id="layer47836BF94702A702E083D03223DED79E" type="title" className="cstlayer" style={layerStyle6} mid="" fatherid="layer27C29CA08D58FCDA22CD55A81B1B78AC" deg="0">
                <div className="wp-title_content" style={contentStyle6}>
                    <span style={spanStyle6}><strong>新西兰黄心奇异果</strong></span>
                </div>
            </div>
                <div id="layer92BFA7BD647A08BD74E68F1E02B67815" type="title" className="cstlayer" style={layerStyle7} mid="" fatherid="layer27C29CA08D58FCDA22CD55A81B1B78AC" deg="0">
                    <div className="wp-title_content" style={contentStyle7}>
                        <span style={spanStyle7}>香甜多汁 一个满足一日VC所需要</span>
                    </div>
                </div>
            </Col>
        </Row>
        </div>
    </>
)
}
export default thirdFace;